<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="bootstrap-3.3.7-dist/css/bootstrap.css"/>
		<link rel="stylesheet" type="text/css" href="bootstrap-3.3.7-dist/css/bootstrap-theme.min.css"/>
		<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
		<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		
		<link rel="stylesheet" type="text/css" href="css/manager.css"/>
		<link rel="stylesheet" type="text/css" href="css/print.css"/>
		<style type="text/css">
			
			body{
				background-color: #07cbc9;
			}
			.head{
				background-color: #07cbc9;
			}
			.head{
				color: rgba(0,0,0,0.5);
				position: fixed;
				top: 0px;
			}
			.head .title .user{
				float:right;
				margin-right: 15px;
				margin-top: -14px;
			}
			.head .title .user .userimage{
				width: 40px;
				border-radius:50% ;
				overflow: hidden;
			}
			.head .title .user a{
				color: white;
			}
			.head .title .user a:hover{
				color: darkorange;
				text-decoration: none;
			}
			.head .input{
				width: 420px;
				margin-right: 30px;
				display: inline-block;
				float: right;
			}
			
			.context{
				width: 100%;
				height: 100%;
				position: fixed;
				top: 60px;
				
			}
			.context .menu{
				z-index: 999;
				position:fixed;
				left: 0;
				top:60px;
				bottom:60px;
				width: 190px;				
				background-color: white;
				color: black;
				border-radius: 15px;
				margin: 5px 0;
				margin-left: 5px;
				box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
			}
			.context .menu ul{
				margin-top: 45px;
				text-decoration: none;
			}
			.context .menu a{
				color: #036564;
				text-decoration: none;
			}
			.context .menu a li {
				list-style: none;
				font-family: "微软雅黑";
				font-weight: bolder;
				padding: 20px 0px;
				padding-left: 35px;
				height: 60px;
				line-height: 25px;
				font-size: 0.8em;
				border-top-left-radius: 15px;
				border-bottom-left-radius: 15px;
			}

			.readed{
				color: white;
				text-decoration: none;
				background-color: rgba(0,0,0,0.6);
			}
			
			.context .menu a>li:hover{
				text-decoration: none;
				background-color: rgba(0,0,0,0.2);
			}
						
			.content{
				border-radius: 15px;
				margin: 5px 0px;
				z-index: -999;
				background-color: white;
				padding: 15px;
				position: fixed;
				left: 200px;
				right: 5px;
				top: 60px;
				bottom: 60px;
				overflow: auto;
				box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
				
			}
			.foot{
				height: 60px;
				position: absolute;
				bottom: 0;
				background-color: #07cbc9;
				padding-top: 25px;
				color: whitesmoke;
				z-index: -999;
			}
		</style>
	</head>
	<body ng-app="mapp" >
		<div class="head">
			<div class="title">
				<div class="logo">
					畅游在线考试系统（管理界面）
				</div>
				
				<div class="ver">
					ver:<span id="var">1.0.0</span>
				</div>
				<div class="user">
					<a href="#">
						<div class="userimage">
							<img src="img/timg (2).jpg" width="100%"/>
						</div>
						admin
					</a>
				</div>
				<div class="input">
					<div class="input-group ">
				      <input type="text" class="form-control" placeholder="查询学员id / 姓名 / 电话" id="searchText">
				      <span class="input-group-btn">
				        <button class="btn btn-default " id="searchButton" >查询</button>
				      </span>
				    </div><!-- /input-group -->
				</div>
			</div>
		</div>
		<div class="context">
			<div class="menu ">
				<ul id="menu">
					<a href="#"><li><span class="glyphicon glyphicon-home"></span><span > 返回首页</span></li></a>
					<a href="#/queryStFun"><li><span class="glyphicon glyphicon-eye-open"></span> <span> 查找学员</span></li></a>
					<a href="#"><li><span class="glyphicon glyphicon-tasks"></span> <span>题目管理</span></li></a>
					<a href="#"><li><span class="glyphicon glyphicon-hdd"></span> <span>题库管理</span></li></a>
					<a href="#"><li><span class="glyphicon glyphicon-user"></span> <span>用户管理</span></li></a>
				</ul>
			</div>
			<div class="content">
				<div ng-view></div>
			</div>
		</div>
		<div class="foot">
			 南京中卓科技有限公司 &copy; 2018
		</div>
	</body>
	
	<script src="js/angular-1.5.8.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/angular-route.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/app.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		
		$(function(){
			
			$("#searchButton").click(function(){
				var search = $("#searchText").val();
				if(search != undefined && search.length>0){
					location.href="#/queryStudy/"+search;
				}
			});
			
		});
		
		function setMenuActive(num){
			$("#menu>a").find("li").removeClass("readed");
			$("#menu>a").eq(num).find("li").addClass("readed");
		}
		
		angular.module("mapp",["ngRoute"]);
		angular.module("mapp").config(["$routeProvider",function($routeProvider){
			$routeProvider
			.when("/stud/:pagenum",{
				templateUrl:"home.html",
				controller:mainController
			}).when("/query/:playerId",{
				templateUrl:"query.html",
				controller:playerQuery
			}).when("/queryStudy/:searchStudy",{
				templateUrl:"queryStudy.html",
				controller:queryStudy
			}).when("/queryStFun",{
				templateUrl:"queryStFun.html",
				controller:queryStudy
			}).otherwise("/stud/0");
		}]);
		
		
	</script>
	
</html>
